layui.use(['layer','table','laytpl','tree','element','laypage'],function(){
    var layer = parent.layer === undefined ? layui.layer : top.layer,
        $ = layui.jquery,
        laytpl = layui.laytpl,
        table = layui.table
        ,tree = layui.tree
        ,element = layui.element
        ,laypage = layui.laypage;
    var currId;
    var currType;
    var currTab='';
    var displayProPic = '',displayPreTab = 'none';
    var currCurr,currLimit;
    layer.ready(function(){
        $("#photoProPic").css('display', displayProPic);
        $("#photoPreTable").css('display', displayPreTab);
        initTableCheckbox();
    });
    $.post("/getXxxxBjxxTree", function (data) {
        //渲染
        tree.render({
            elem: '#treePhotoList'
            ,data: data//返回的数据
            ,click: function(obj){
                var tempId = obj.data.id;
                if(tempId.lastIndexOf("@@")==-1){
                    return false;
                }
                currType = tempId.split("@@")[0];
                currId = tempId.split("@@")[1];
                refrash($(".searchVal").val(),currId,currType,currTab);
            }
        });
    });

    laypage.render({
        elem: 'stu_PhotoPage' //注意，这里的 test1 是 ID，不用加 # 号
        ,count: $('#count').val() //数据总数，从服务端得到
        ,limit: 10
        ,limits: [10,15,20,30]
        ,curr: 1
        ,groups: 3
        ,layout:['prev', 'page', 'next','limit','count']
        ,jump: function(obj, first){
            //obj包含了当前分页的所有参数，比如：
            console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
            console.log(obj.limit); //得到每页显示的条数
            currCurr = obj.curr;
            currLimit = obj.limit;
            //首次不执行
            if(!first){
                refrash($(".searchVal").val(),currId,currType,currTab,currCurr,currLimit);
            }
        }
    });

    //一些事件监听
    element.on('tab(photoListTabBrief)', function(data){
        currTab = $(this).attr('data-type');
        refrash($(".searchVal").val(),currId,currType,currTab);
    });

    element.on('tab(photoStyleTabBrief)', function(data){
        var style = $(this).attr('data-style');
        if(style!=undefined&&style!=''&&style=='doTable'){
            displayProPic = 'none';
            displayPreTab = '';
        }else{
            displayProPic = '';
            displayPreTab = 'none';
        }
        $("#photoProPic").css('display', displayProPic);
        $("#photoPreTable").css('display', displayPreTab);
    });

    function show_img(t) {
        var t = $(t).find("img");
        //页面层
        layer.open({
            type: 1,
            skin: 'none', //加上边框
            area: ['45%', '80%'], //宽高
            shadeClose: true, //开启遮罩关闭
            end: function (index, layero) {
                return false;
            },
            content: '<div style="text-align:center"><img src="' + $(t).attr('src') + '" /></div>'
        });
    }

    $(document).on('click',".stuPhoto", function () {
        show_img(this);
    });

    $(".expStuPhoto_btn").click(function(){
        var xxId,bjId;
        var xsIds = "24";
        var downSPConfirm = layer.confirm('需要导出哪些范围的学生照片？', {
            btn: ['整个学校', '某个班级', '部分学生']
            , btn1:function(){
                xxId = currType!=undefined&&currType!=null&&currType=='school' ? currId:null;
                if(xxId==undefined||xxId==null){
                    layer.msg("先选择需要导出的学校。");
                    return false;
                }
                location.href = "/expStuPhoto?xxxxId="+xxId+"&bjxxId=&xsIds=";
            }
            , btn2: function () {
                bjId = currType!=undefined&&currType!=null&&currType=='bjxx' ? currId:null;
                if(bjId==undefined||bjId==null){
                    layer.msg("先选择需要导出的班级。");
                    return false;
                }
                location.href = "/expStuPhoto?xxxxId=&bjxxId="+bjId+"&xsIds=";
            }
            , btn3: function () {
                if(xsIds==undefined||xsIds==""){
                    layer.msg("先选择需要导出的学生。");
                    return false;
                }
                location.href = "/expStuPhoto?xxxxId=&bjxxId=&xsIds="+xsIds;
            }
        });
    });

    function refrash(searchVal,id,type,tab,curr,limit){
        $.ajax({
            url: "/refrashPhoto",
            type: 'POST',
            data:{
                searchVal: searchVal  //搜索的关键字
                ,id: id
                ,type: type
                ,tab: tab
                ,curr: curr
                ,limit: limit
            },
            success: function (data) {
                $(".stu_PhotoPre").html(data);
                $("#photoProPic").css('display', displayProPic);
                $("#photoPreTable").css('display', displayPreTab);
                if(displayProPic == 'none'&&displayPreTab == ''){
                    initTableCheckbox();
                }
            }
        });
    }

    //搜索【此功能需要后台配合，所以暂时没有动态效果演示】
    $(".search_btn").on("click",function(){
        refrash($(".searchVal").val(),currId,currType,currTab);
    });

    document.onkeydown = function(e){
        var ev = document.all ? window.event : e;
        if(ev.keyCode==13) {
            refrash($(".searchVal").val(),currId,currType,currTab,currCurr,currLimit);
        }
    }

    function initTableCheckbox() {
        var $thr = $('table thead tr');
        var $checkAllTh = $('<th><input type="checkbox" id="checkAll" name="checkAll" /></th>');
        /*将全选/反选复选框添加到表头最前，即增加一列*/
        $thr.prepend($checkAllTh);
        /*“全选/反选”复选框*/
        var $checkAll = $thr.find('input');
        $checkAll.click(function(event){
            /*将所有行的选中状态设成全选框的选中状态*/
            $tbr.find('input').prop('checked',$(this).prop('checked'));
            /*并调整所有选中行的CSS样式*/
            if ($(this).prop('checked')) {
                $tbr.find('input').parent().parent().addClass('warning');
            } else{
                $tbr.find('input').parent().parent().removeClass('warning');
            }
            /*阻止向上冒泡，以防再次触发点击操作*/
            event.stopPropagation();
        });
        /*点击全选框所在单元格时也触发全选框的点击操作*/
        $checkAllTh.click(function(){
            $(this).find('input').click();
        });
        var $tbr = $('table tbody tr');
        var $checkItemTd = $('<td><input type="checkbox" name="checkItem" /></td>');
        /*每一行都在最前面插入一个选中复选框的单元格*/
        $tbr.prepend($checkItemTd);
        /*点击每一行的选中复选框时*/
        $tbr.find('input').click(function(event){
            /*调整选中行的CSS样式*/
            $(this).parent().parent().toggleClass('warning');
            /*如果已经被选中行的行数等于表格的数据行数，将全选框设为选中状态，否则设为未选中状态*/
            $checkAll.prop('checked',$tbr.find('input:checked').length == $tbr.length ? true : false);
            /*阻止向上冒泡，以防再次触发点击操作*/
            event.stopPropagation();
        });
        /*点击每一行时也触发该行的选中操作*/
        $tbr.click(function(){
            $(this).find('input').click();
        });
    }

    // 获取复选框被选中的数据
    $("#link-user-r-btn").on('click', function () {
        var checkids = [];
        var dataId = [];
        var dataName = [];
        $("input[name='checkItem']:checked").each(function (i) {
            checkids[i] = $(this).val();
        });
        if (checkids.length <= 0) {
            util.error("请至少选择一条记录");
        } else {
            console.log(checkids);
            $("#dgFlowList").find(":checkbox:checked").each(function () {
                // var val = $(this).parents("tr").children("input").val();
                var val = $(this).parents("tr").children("input[name='sid']").val();
                var val1 = $(this).parents("tr").children("input[name='sname']").val();
                dataId.push(val);
                dataName.push(val1);
            });
        }
    });


})
